import React from "react"
import NavCss from './index.module.scss'

import { Link, withRouter } from 'react-router-dom'

function MyNav(props) {

    const routerPath = props.location.pathname
    const navShow = (routerPath === "/"  || routerPath === "/category" ||
     routerPath === "/discover" || routerPath === "/cart" ||
      routerPath === "/my" || routerPath === "/cart/cartDom" || routerPath==="/cart/cartOve");
    return (
        <ul className={navShow?NavCss.main:NavCss.hide}>
            {
                props.navList.length > 0 &&
                props.navList.map((item, index) => {
                    return (
                        <li className={item.router==="/discover"?NavCss.navLists:''} key={index}>
                            <Link to={item.title==="购物车"?item.router+"/cartDom": item.router} className={routerPath===item.router || routerPath===item.router+"/cartDom" || routerPath===item.router+"/cartOve"?NavCss.active:NavCss.navList}>
                                <img src={item.img} alt="" className={item.router==="/discover"?NavCss.navImg:NavCss.hide} />
                                <i className={"iconfont "+item.icon}></i>
                                <p>{item.title}</p>
                            </Link>
                        </li>
                    )
                })
            }

        </ul>
    )
}
export default withRouter(MyNav);